<template>
	<view class="content">
		<!-- 赛事选择提醒 -->
		<view class="head">请选择需要报名的赛事</view>
		<view class="main">
			<view @click="enteCompetition(data.id)" class="core" v-for="(data,index) in indexData" :key=index>
				<text>
					{{data.competitionName}}
				</text>
				<view class="p">
					报名时间 {{data.competitionStart | DataFilter}} 至 {{data.competitionFinish | DataFilter}}
				</view>
			</view>
		</view>


	</view>
</template>

<script>
	import index from '@/api/index.js'

	export default {
		data() {
			return {
				title: '配音比赛',
				indexData:[],
				tokenOpenid:"",
			}
		},
		onShow() {
			//获取用户openid存储一下
			this.tokenOpenid = uni.getStorageSync("token_openid");
			//获取赛事信息
			this.getCompetitionList()
		},
		methods: {
			//进入比赛页面
			enteCompetition(id){
				let data ={
					openId:this.tokenOpenid,
					competitionId:id
				}
				index.is_possible_register(data).then(res=>{

					if(res.data.length == 0){
						uni.navigateTo({
							url:'../signUp/signUp?id='+id
						})
					}
					if(res.data[0].submitCompleted == 1){
						uni.showModal({
							title:"提示",
							content:"你已经提交过报名，请勿重复提交",
							success:function(res){
							}
						})
						return
					}else{
						
						uni.navigateTo({
							url:'../signUp/signUp?id='+id
						})
					}
				})

			},
			getCompetitionList(){
				index.get_competition_list().then(res=>{
					if(res.code == 200){
						this.indexData = res.data
					}
				})
			},
			dianji(){
				uni.navigateTo({
				    url: '../../pages/signUp/signUp',
					success(res) {
						console.log(res);
					},fail(err) {
						console.log(err);
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: rgb(251,251,253);
	}
	.head{
		margin: 40rpx 0;
		font-size: 55rpx;
		font-weight: 600;
		color: rgb(33,36,40);
	}
	.main{
		width: 100%;
		margin-bottom: 60rpx;
		.core{
			text-align: center;
			margin: 20rpx 40rpx;
			border: 1px solid #ccc;
			background-color: rgb(255,255,255);
			padding: 60rpx;
			border-radius: 30rpx;
			text{
				font-size: 35rpx;
				font-weight: 600;
				color: rgb(33,36,40);
			}
			.p{
				margin-top: 40rpx;
				font-size: 20rpx;
				color: rgb(174,181,188);
			}
		}
	}
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
</style>
